<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>CSS Test: height:auto on two regions box with different widths</title>
        <style>
        /*<![CDATA[*/
    #regionA {
        width: 800px;
        height: auto;
        border: 1px solid #a0a0a0;
    }

    #regionB {
        width: 400px;
        height: auto;
        border: 1px solid #a0a0a0;
    }

    /*]]>*/
    </style>
    </head>
    <body>
        <p>You should see to gray boxes, one with the text 'In first region' and the other with 
            the text 'In second region'. The first box should be twice as wide as the second one.</p>
        <div id="regionA">
        <div id="article-fragment-1">
            <p>In first region.</p>
        </div>
        </div>
        <div id="regionB">
        <div id="article-fragment-2">
            <p>In second region.</p>
        </div>
        </div>
    </body>
    </html>